.sysmana-layout{
    height: 100%;
    display: flex;
    gap: 10px;

    .system-header{
        border-bottom:1px solid #e3e3e3;
        padding: 8px 0 0 0;

        .system-header-item{
            display: flex;
            gap: 5px;
            align-items: center;
            padding: 7px 20px;
        }

        .system-header-title{
            font-size: 18px;
            font-weight: bold;
            cursor: pointer;
        }

        .system-header-back-home{
            cursor: pointer;

            &:hover{
                background: #e3e8f0;
            }
        }

    }

    .tiklab-orga-aside {
        height: 100%;
        width: 220px;
        border-right: 1px solid var(--pi-border-color);
        background: #f0f3fa;
        overflow: auto;

        ul,li {
            list-style: none;
        }

        .orga-aside-hidden {
            display: none;
        }

        .aside-li{
            cursor: pointer;
            padding: 0 15px 0 16px;
            display: flex;
            align-items: center;
            gap: 5px;
        }

        .orga-aside-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            height: 40px;
            line-height: 40px;
            padding-left: 3px;
        }

        .orga-aside-item:hover{
            background-color:#e3e8f0;
        }

        .aside-item-li{
            padding: 0 15px;
        }

        .orga-aside-li {
            height: 40px;
            line-height: 40px;
            border-left: 3px solid rgba(255, 255, 255, 0)

        }

        .orga-aside-li:hover{
            background-color: #e3e8f0;
            border-left: 3px solid var(--pi-base-color);
        }

        .orga-aside-select {
            background-color: #e3e8f0;
            border-left: 3px solid var(--pi-base-color);
        }
    }
}

.sysmana-sider{
    width: 200px;
    //background-color: var(--pi-bg-color);
    height: 100%;
}

.sysmana-menu{
    height: 100%;
}

.sysmana-content{
    overflow: auto;
    height: 100%;
    background-color: var(--pi-bg-color);
    //padding: 0 10px;
    flex: 1;
}


// evnMana
.environment-breadcrumb{
    margin: 15px 0;
}

.environment-searchbtn{
    margin: 15px 0;
    display: flex;
    justify-content: space-between;
}


.ant-modal-close-x{
    display: flex !important;
    justify-content: center;
    align-items: center;
}

.menu-name-icon{
    display: flex;
    width: 120px;
    height: 30px;
    align-items: center;
    gap: 5px;
    padding-left: 3px;
}


.dataStructure-modal-box{

    .ant-modal-body{
        min-height: 300px;
    }
}

.version-function-box{

    .ant-table-cell{
        padding: 10px;
    }

    .ant-table-thead > tr > th{
        font-weight: var(--pi-font-weight-title);
    }
}


.system-home{
    //width: 1024px;
    padding: 20px;
    margin: 0 auto;

    .system-content{
        padding:10px;
    }

    .system-module{
        padding: 10px;
        //background: #f5f4f4;
        margin: 10px;
        border-radius: 5px;
    }

    .system-role-module{
        padding: 10px;
        margin: 10px;
        border-radius: 5px;

        .system-role{
            display: flex;
            justify-content: space-around;
            align-items: center;
            //padding: 5px 0;
            margin: 5px 0 0 0;
            background: #f5f4f4;
            border: 1px solid #e8e8e8;
            background: var(--pi-bg-grey-100);
            padding: 10px;
            border-radius: 5px;
        }
    }




    .system-menu-box{
        //display: flex;
        //align-items: center;
        //gap: 10px;
        padding: 5px 0;
        margin: 5px 0 0 0;
    }
    .system-menu-role{
        height: 90px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
        padding: 10px;
        border-radius: 5px;
        //border: 1px solid #e8e8e8;
    }

    .system-menu-item{
        background: var(--pi-bg-grey-100);
        //width: 195px;
        height: 90px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
        padding: 10px;
        border-radius: 5px;
        border: 1px solid #e8e8e8;


        &:hover{
            cursor: pointer;
        }
    }
}


